<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

<head>
    <title id="projectName1"></title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/resources/xznstatic/css/font-awesome.min.css">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/resources/xznstatic/css/bootstrap.min.css">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/resources/xznstatic/css/animate.css">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/resources/xznstatic/css/all.css">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/resources/xznstatic/css/pink-violet.css" id="theme-change" class="style-change color-change">
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/resources/xznstatic/css/style-responsive.css">

    <script type="text/javascript" src="${pageContext.request.contextPath}/resources/assets2/js/jquery.min.js"></script>
</head>

<body id="signin-page">
<div class="page-form">
    <form id="smsLoginForm" action="" method="post" class="form">
        <div class="header-content">
            <h1 id="projectName" ></h1>
        </div>
        <div class="body-content">
            <div class="form-group">
                <div class="input-icon right">
                    <input type="text" placeholder="手机号" id="phone" name="phone" class="form-control" required>
                </div>
            </div>
            <div class="form-group">
                <div class="input-icon right">
                    <input type="password" placeholder="验证码" name="smsCode" class="form-control" required>
                    <input type="button" value="获取验证码" onclick="getSmsCode()">
                </div>
            </div>
            <div class="form-group">
                <div class="checkbox-list">
                    <label>
                        <input type="radio" name="chk" id ="adminId" value="管理员" onclick="checkRole('users')">&nbsp;管理员
                    </label>
                </div>
            </div>
            <div class="form-group">
                <div class="checkbox-list">
                    <label>
                        <input type="radio" name="chk" id ="yonghuId" value="用户" onclick="checkRole('yonghu')">&nbsp;用户
                    </label>
                </div>
            </div>

            <div id="submitBtn" class="form-group"><button type="submit" class="btn btn-success" style="width: 100%;" onclick="sms_login()">登 录</button></div>
            <div class="form-group"><button type="button" class="btn btn-success" style="width: 100%;" onclick="window.location.href='./modules/yonghu/register.jsp'">注册  用户</button></div>
            <div class="form-group"><button type="button" class="btn btn-success" style="width: 100%;" onclick="window.location.href='./login.jsp'">账户 登录</button></div>

            <div class="clearfix"></div>
            <hr>
            <div class="row mbm text-center">
            </div>
        </div>
    </form>
</div>

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/assets2/js/bootstrap.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/jquery.form.js"></script>

<script type="text/javascript">

    <%@ include file="utils/menu.jsp"%>

    <%@ include file="utils/baseUrl.jsp"%>

    function getSmsCode() {
        debugger
        var tableName = "";
        var adminId = $('#adminId').val();
        var yonghuId = $('#yonghuId').val();

        var roleValue = $("input[name='chk']:checked").val();

        if (roleValue == "" || roleValue == null) {
            alert("请选择角色后再获取验证码");
            return;
        }

        if(roleValue=="管理员"){
            tableName = "users";
        }
        if(roleValue=="用户"){
            tableName = "yonghu";
        }

        var phone = $('#phone').val();
        if(phone == null){
            alert("手机号不能为空");
            return;
        }

        $.ajax({
            url:baseUrl + tableName + '/getSmsCode',
            data:{'phone':phone}   ,
            success:function (resp) {
                alert(resp.msg);
            }
        })
    }

    // var role = "";
    var accountTableName = "";
    function checkRole( tableName) {
        // role = roleName;
        $('#smsLoginForm').attr('action', baseUrl + tableName + '/smslogin');
        accountTableName = tableName;
    }
    function sms_login() {
        var roleValue = $("input[name='chk']:checked").val();

        $("#smsLoginForm").ajaxForm(function(res) {
            if (roleValue == "" || roleValue == null) {
                alert("请选择角色后再登录");
            } else {
                if (res.code == 0) {
                    var phone = $('#phone').val();
                    window.sessionStorage.setItem('accountTableName',accountTableName);
                    window.sessionStorage.setItem('phone',phone);
                    window.sessionStorage.setItem('token', res.token);
                    window.sessionStorage.setItem('role', res.role);
                    window.sessionStorage.setItem('userId', res.userId);
                    window.location.href = "${pageContext.request.contextPath}/index.jsp";
                } else {
                    alert(res.msg);
                }
            }
        });
    }
    function ready() {
        document.getElementById('projectName').innerHTML=projectName;
        document.getElementById('projectName1').innerHTML=projectName;
    }
    document.addEventListener("DOMContentLoaded", ready);
</script>
</body>

</html>
